<!-- @/pages/groups/cpns/group_list.vue -->
<template>
    <view class="group-item" @click="goToChat">
        <u-image :src="item.avatarUrl" width="80rpx" height="80rpx" border-radius="16"></u-image>
        <view class="group-info">
            <text class="group-name">{{ item.name }}</text>
        </view>
        <text class="time">{{ item.lastTime }}</text>
    </view>
</template>

<script>
export default {
    props: {
        item: {
            type: Object,
            required: true
        }
    },
    methods: {
       goToChat() {
           const { id, name } = this.item;
           console.log('点击跳转群聊:', id, name);
       
           uni.navigateTo({
               url: `/pages/groups/group_chat?groupId=${id}&groupName=${encodeURIComponent(name)}`
           });
       }
    }
};
</script>

<style scoped>
.group-item {
    display: flex;
    align-items: center;
    padding: 20rpx;
    border-bottom: 1rpx solid #eee;
}

.group-info {
    flex: 1;
    margin-left: 20rpx;
}

.group-name {
    font-size: 30rpx;
    font-weight: bold;
}

.last-message {
    color: #999;
    font-size: 26rpx;
    display: block;
    margin-top: 4rpx;
}

.time {
    color: #999;
    font-size: 24rpx;
}
</style>